<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>图书馆后台管理</title>
    <style type="text/css">
        #Container {

            margin: 0 auto; /*设置整个容器在浏览器中水平居中*/

        }

        #Header {

            padding-top: 20px;
            height: 80px;
            background-color: #2eb398;

        }

        #inner {
            width: 1000px;
            margin: 0 auto;
        }

        #Content {

            overflow: auto;
            /*此处对容器设置了高度，一般不建议对容器设置高度，一般使用overflow:auto;属性设置容器根据内容自适应高度，如果不指定高度或不设置自适应高度，容器将默认为1个字符高度，容器下方的布局元素（footer）设置margin-top:属性将无效*/
            /*此处讲解margin的用法，设置content与上面header元素之间的距离*/
            background: #009966;
        }

        #Content-Left {
            height: 800px;
            width: 15%;
            float: left; /*设置浮动，实现多列效果，div+Css布局中很重要的*/
            background: #232b2d;

        }

        #Content-Main {
            height: 800px;
            width: 84.999%;
            float: left; /*设置浮动，实现多列效果，div+Css布局中很重要的*/
            background: #FFFF99;
        }

        /*注：Content-Left和Content-Main元素是Content元素的子元素，两个元素使用了float:left;设置成两列，这个两个元素的宽度和这个两个元素设置的padding、margin的和一定不能大于父层Content元素的宽度，否则设置列将失败*/

        .Clear {
            clear: both;
        }
    </style>
</head>

<body>
<div id="Container">
    <div id="Header">
        <div id="logo">
            <%@include file="header.jsp" %>
        </div>
    </div>
    <div id="Content">

        <div id="Content-Left">
            <%--<a href="${basePath}menu/getAllMenu">菜单列表</a>--%>
            <%@include file="menu.jsp" %>
        </div>
        <div id="Content-Main">
            <iframe id="mainContent" name="mainContent" width="100%" height="100%"
                    frameborder="0" scrolling="auto" src="${basePath}jsp/main.jsp"></iframe>
        </div>

    </div>
    <div class="Clear">
        <!--如何你上面用到float,下面布局开始前最好清除一下。-->
    </div>
    <div id="Footer">
        <div id="inner"></div>
    </div>
</div>
</body>
</html>